<template>
  <div>
    <a-drawer
      :closable="false"
      :visible="visible"
      :width="1200"
      :body-style="{
        padding: 0,
        height: '100%',
        background: '#f7f7f7',
      }"
      :destroyOnClose="true"
      :headerStyle="{ padding: 0 }"
      @close="handleCancel"
    >
      <TurnoverDetail :tId="id" :isDrawer="true" @closeAllModal="closeAllModal"/>
    </a-drawer>
  </div>
</template>
<script>
import { defineComponent } from "vue";
import TurnoverDetail from "@/views/bill/TurnoverDetail/index.vue";

export default defineComponent({
  name: "TurnoverDetailDrawer",
  props: {
    visible: {
      type: Boolean,
      default: false,
    },
    // 收支流水id
    id: {
      type: [Number, String],
      default: 0,
    },
  },
  components: {TurnoverDetail },
  setup(props, { emit }) {
    const handleCancel = () => {
      emit("handleCancel");
    };

    window.addEventListener('message',(event)=>{
      handleCancel()
    },false )

    const closeAllModal = () => {
      handleCancel();
      emit("closeAllModal")
    };

    return {
      handleCancel,
      closeAllModal,
    };
  },
});
</script>
